# css snippets 
# author: wondger@gmail.com
snippet reset
	/*reset*/
	body,div,table,h1,h2,h3,h4,h5,h6,ul,ol,li,p,dl,dt,dd,th,td,form,fieldset{margin:0;padding:0;}
	table{border-collapse:collapse;}
	pre,code{white-space:pre;font-family:"Courier New",Courier,monospace;}
	li{list-style:none;}
	em{font-style:normal;}
	img,object{border:none;outline:none;}
	a img{vertical-align:top;}
	abbr,article,aside,audio,canvas,datalist,details,figure,footer,header,hgroup,menu,nav,output,progress,section,video{display:block;margin:0;padding:0;}
	/*reset*/
snippet *
	*{margin:0;padding:0;list-style:none;}${1}
snippet z
	zoom:1;${1}
snippet ep
	zoom:expression(function(el){el.style.width=el.parentNode.offsetWidth+'px'}(this));
snippet zi
	z-index:${1:1};${2}
snippet f
	font:${2:normal/bold} ${3:12}px/${4:1.6} ${1:arial};${5}
snippet ff
	font-family:${1:Arial,Helvetica,sans-serif};${2}
snippet fw
	font-weight:${1:bold};${2}
snippet fwn
	font-weight:normal;${1}
snippet fs #font-size
	font-size:${1:12}px;${2}
snippet fs #font-style
	font-style:${1:normal/italic/oblique};${2}
snippet !ip
	!important;${1}
snippet p
	padding:${1}px;${2}
snippet p0
	padding:0;${1}
snippet p2
	padding:${1}px ${2}px;${3}
snippet p3
	padding:${1}px ${2}px ${3}px;${4}
snippet p4
	padding:${1}px ${2}px ${3}px ${4}px;${5}
snippet pt
	padding-top:${1}px;${2}
snippet pt0
	padding-top:0;${1}
snippet pb
	padding-bottom:${1}px;${2}
snippet pb0
	padding-bottom:0;${1}
snippet pl
	padding-left:${1}px;${2}
snippet pl0
	padding-left:0;${1}
snippet pr
	padding-right:${1}px;${2}
snippet pr0
	padding-right:0;${1}
snippet m
	margin:${1}px;${2}
snippet ma
	margin:0 auto;${1}
snippet m0
	margin:0;${1}
snippet m2
	margin:${1}px ${2}px;${3}
snippet m3
	margin:${1}px ${2}px ${3}px;${4}
snippet m4
	margin:${1}px ${2}px ${3}px ${4}px;${5}
snippet mt
	margin-top:${1}px;${2}
snippet mt0
	margin-top:0;${1}
snippet mb
	margin-bottom:${1}px;${2}
snippet mb0
	margin-bottom:0;${1}
snippet ml
	margin-left:${1}px;${2}
snippet ml0
	margin-left:0;${1}
snippet mr
	margin-right:${1}px;${2}
snippet mr0
	margin-right:0;${1}
snippet bg
	background:url(../images/${1}) no-repeat ${2:0} ${3:0};${4}
snippet bgn
	background:none;${1}
snippet bgx
	background:url(../images/${1}) repeat-x ${2:0} ${3:0};${4}
snippet bgy
	background:url(../images/${1}) repeat-y ${2:0} ${3:0};${4}
snippet bgi
	background-image:url(../images/${1});${2}
snippet bgc
	background-color:#${1};${2}
snippet bgr
	background-repeat:${1:no-repeat};${2}
snippet bgrn
	background-repeat:no-repeat;${1}
snippet bgrx
	background-repeat:repeat-x;${1}
snippet bgry
	background-repeat:repeat-y;${1}
snippet bgp
	background-position:${1:0} ${2:0};${3}
snippet h
	height:${1}px;${2}
snippet ha
	height:auto;${1}
snippet hb
	height:100%;${1}
snippet w
	width:${1}px;${2}
snippet wa
	width:auto;${1}
snippet wb #width:100%
	width:100%;${1}
snippet minw
	min-width:${1}px;${2}
snippet maxw
	max-width:${1}px;${2}
snippet minh
	min-height:${1:}px;_height:$1px;${2}
snippet maxh
	max-height:${1}px;${2}
snippet c
	color:#${1};${2}
snippet co
	color:#${1};${2}
snippet di
	display:inline;${1}
snippet d
	display:block;${1}
snippet db
	display:block;${1}
snippet dn
	display:none;${1}
snippet vv
	visibility:visible;${1}
snippet vh
	visibility:hidden;${1}
snippet ib
	display:inline-block;zoom:1;*display:inline;${1}
snippet dtb
	display:table;${1}
snippet dtc
	display:table-cell;${1}
snippet vm
	vertical-align:middle;${1}
snippet vt
	vertical-align:top;${1}
snippet tc
	text-align:center;${1}
snippet tl
	text-align:left;${1}
snippet tr
	text-align:right;${1}
snippet tj
	text-align:justify;${1}
snippet ti
	text-indent:${1:10}em;${2}
snippet ti0
	text-indent:0;${1}
snippet tdn
	text-decoration:none;${1}
snippet td
	text-decoration:underline;${1}
snippet tdu
	text-decoration:underline;${1}
snippet lh
	line-height:${1};${2}
snippet boco
	border-collapse:collapse;${1}
snippet bo
	border:1px solid #${1:EEE};${2}
snippet bow
	border-width:1px;${1}
snippet bos
	border-style:solid;${1}
snippet boc
	border-color:#${1:EEE};${2}
snippet bo0
	border:0;${1}
snippet bon
	border:none;${1}
snippet bot
	border-top:1px solid #${1};${2}
snippet bot0
	border-top:0;${1}
snippet botc
	border-top-color:#${1};${2}
snippet botn
	border-top:none;${1}
snippet bor
	border-right:1px solid #${1};${2}
snippet bor0
	border-right:0;${1}
snippet borc
	border-right-color:#${1};${2}
snippet born
	border-right:none;${1}
snippet bob
	border-bottom:1px solid #${1};${2}
snippet bob0
	border-bottom:0;${1}
snippet bobc
	border-bottom-color:#${1};${2}
snippet bobn
	border-bottom:none;${1}
snippet bol
	border-left:1px solid #${1};${2}
snippet bol0
	border-left:0;${1}
snippet bolc
	border-left-color:#${1};${2}
snippet boln
	border-left:none;${1}
snippet fl
	float:left;${1}
snippet fr
	float:right;${1}
snippet fn
	float:none;${1}
snippet cb
	clear:both;${1}
snippet oh
	overflow:hidden;${1}
snippet oa
	overflow:auto;${1}
snippet os
	overflow:scroll;${1}
snippet ov
	overflow:visible;${1}
snippet pos
	position:static;${1}
snippet poa
	position:absolute;${1}
snippet por
	position:relative;${1}
snippet pof
	position:fixed;_position:absolute;zoom:expression(function(el){el.style.top=document.documentElement.scrollTop+document.documentElement.clientHeight/2+'px'}(this));${1}
snippet oln
	outline:none;${1}
snippet l
	left:${1}px;${2}
snippet l0
	left:0;${1}
snippet r
	right:${1}px;${2}
snippet r0
	right:0;${1}
snippet t
	top:${1}px;${2}
snippet t0
	top:0;${1}
snippet b
	bottom:${1}px;${2}
snippet b0
	bottom:0;${1}
snippet ls
	list-style:${1:image} ${2:inside/outside} ${3:type};${4}
snippet lst
	list-style-type:${1:disc/decimal/none/circle};${2}
snippet lsn
	list-style:none;${1}
snippet lts
	letter-spacing:${1}px;${2}
snippet ws
	white-space:${1:nowrap/normal/pre};${2}
snippet cp
	cursor:pointer;${1}
snippet ww
	word-wrap:${1:break-word}${2:break-all};${3}
snippet wb
	word-break:break-all;${1}
# IE fix
snippet op
	filter:alpha(opacity=${1:50});opacity:${2:0.5};${3}
snippet png
	background:url(images/${1:}) no-repeat 0 0;_background:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/$1',sizingMethod='scale');zoom:1;${2}
# CSS3
snippet br
	border-radius:${1};${2}
snippet brn
	border-radius:none;${1}
snippet brtl
	border-top-left-radius:${1};${2}
snippet brtl0
	border-top-left-radius:0;${1}
snippet brtr
	border-top-right-radius:${1};${2}
snippet brtr0
	border-top-right-radius:0;${1}
snippet brbl
	border-bottom-left-radius:${1};${2}
snippet brbl0
	border-bottom-left-radius:0;${1}
snippet brbr
	border-bottom-right-radius:${1};${2}
snippet brbr0
	border-bottom-right-radius:0;${1}
snippet bs
	box-shadow:${1} ${2} ${3} #${4};${5}
snippet ts #text-shadow
	text-shadow:${1:px} ${2:px} ${3:px} #${4:CCC};${5}
snippet to
	overflow:hidden;text-overflow:ellipsis;word-break:keep-all;white-space:nowrap;${1}
snippet tsp
	transition-property:${1:all/none/property};-webkit-transition-property:$1;-moz-transition-property:$1;-o-transition-property:$1;${2}
snippet tsd
	transition-duration:${1:2s};-webkit-transition-duration:$1;-moz-transition-duration:$1;-o-transition-duration:$1;${2}
snippet tsf
	transition-timing-function:${1:linear/ease/ease-in/ease-out/ease-in-out/cubic-bezier(n,n,n,n)};-webkit-transition-timing-function:$1;-moz-transition-timing-function:$1;-o-transition-timing-function:$1;${2}
snippet tsl
	transition-delay:${1:2s};-webkit-transition-delay:$1;-moz-transition-delay:$1;-o-transition-delay:$1;${2}
snippet ts #transition
	transition:${1:all/none/property} ${2:2s} ${3:linear/ease/ease-in/ease-out/ease-in-out/cubic-bezier(n,n,n,n)} ${4:0s};-webkit-transition:$1 $2 $3 $4;-moz-transition:$1 $2 $3 $4;-o-transition:$1 $2 $3 $4;}${5}
snippet tf
	transform:${1:none/matrix(n,n,n,n,n,n)/matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n)/translate(x,y)/translate3d(x,y,z)/scale(x,y)/scale3d(x,y,z)/rotate(angle)/rotate3d(x,y,z,angle)/skew(x-angle,y-angle)/perspective(n)};-webkit-transform:$1;-moz-transform:$1;-o-transform:$1;${2}
snippet anm
	animation:${1:name} ${2:duration} ${3:timing-function} ${4:delay} ${5:iteration-count:1/n/infinite} ${6:direction:normal/alternate};-webkit-animation:$1 $2 $3 $4 $5 $6;-moz-animation:$1 $2 $3 $4 $5 $6;$7
snippet kf
	@keyframes ${1:name}{${2:from/to/n%}}
	@-webkit-keyframes $1{$2}
	@-moz-keyframes $1{$2}
# common
snippet cf
	/*clearfix*/
	.clearfix{zoom:1;}
	.clearfix:after {content:'';display:block;clear:both;height:0;visibility:hidden;}${1}
snippet zz
	/*${1}*/${2}
snippet yh
	"\5FAE\8F6F\96C5\9ED1"${1}
snippet xh
	"\534E\6587\7EC6\9ED1"${1}
snippet ht
	"\9ED1\4F53"${1}
snippet st
	"\5B8B\4F53"${1}
snippet wqy
	"\6587\6CC9\9A7F\6B63\9ED1"${1}
snippet ltqh
	"\65B9\6B63\5170\4EAD\7EA4\9ED1\7B80\4F53"
snippet lth
	"\65B9\6B63\5170\4EAD\9ED1\7B80\4F53"
snippet dk
	"Courier New",Courier,monospace${1}
snippet color
	/*color*/
	.b,strong{font-weight:bold!important;}
	.red{color:red!important;}
	.blue{color:blue!important;}
	.redb{color:red!important;font-weight:bold!important;}
	.fuchsia{color:fuchsia!important;}^!
snippet by
	/*-- by wondger ${1} --*/${2}
# nie
snippet res
	http://res.nie.netease.com/${1}
snippet cr
	/*copyright*/
	.copyright{padding:20px 0;text-align:center;font-size:12px;font-family:verdana,tahoma,"\5B8B\4F53";color:#$1;line-height:1;}
		.copyright p{padding:8px 0;}
		.copyright a{color:#${1:};text-decoration:none;}
		.copyright a:hover{text-decoration:underline;}${2}
# taobao
